<script>
	import {
		getNavbarHeight
	} from "@/util"
	export default {
		name: 'uni-byt-top-com',
		props: {
			// 头部标题
			title: {
				type: String,
				default: ''
			},
			// 是否显示返回按钮
			backShow: {
				type: Boolean,
				default: true
			},
			// 背景颜色
			bgColor: {
				type: String,
				default: 'white'
			},
			// 是否显示下边框线
			borShow: {
				type: Boolean,
				default: true
			}
		},
		data() {
			return {
				topHeight: getNavbarHeight(),
				paddingTop: '0px'
			}
		},
		created() {
			// 获取设备信息
			const systemInfo = uni.getSystemInfoSync()
			// 手机状态栏高度
			this.paddingTop = systemInfo.statusBarHeight ? systemInfo.statusBarHeight + 'px' : '0px'
		},
		methods: {
			// 返回上一页
			backClick() {
				if (this.backShow) {
					uni.navigateBack(-1)
				}
			},
		}
	}
</script>

<template>
	<!-- pt-10 pb-10 -->
	<view :style="{backgroundColor:bgColor,height:topHeight+'px',paddingTop:paddingTop}"
		class="w-375 flex flex-row jty-btn items-center box-border" :class="borShow?'border-bottom border-main':''">
		<view @click="backClick" class="flex flex-row items-center w-100 h-30 pl-12">
			<image v-if="backShow" class="w-17 h-20"
				src="https://img.yummall.cn/baiyetong/yunmaobms/static/images/pass/fanHui.png" mode=""></image>
		</view>
		<text class="text-18 text-center">{{title}}</text>
		<view class="w-100 h-30 flex flex-row items-center jty-end pr-12">
			<slot></slot>
		</view>
	</view>
</template>

<style scoped>
</style>